<!DOCTYPE html>

<style>
#border-image,
#border,
#outline {
    height: 100px;
    width: 100px;
}

td {
    height: 50px;
    width: 50px;
    border-style: hidden;
}

#border-image {
    border-image: url(_example.png) 100% 100 100 round;
    border-style: none;
    border-width: 50px;
    position: absolute;
    top: 10px;
    left: 10px;
    border-style: solid;
}
</style>

<script src="../resources/text-based-repaint.js"></script>
<script>
if (window.testRunner)
    testRunner.dumpAsText();

function repaintTest() {
    var border = document.getElementById("border");
    border.style.border = "0";

    var outline = document.getElementById("outline");
    outline.style.outline = "0";

    var outline = document.getElementById("cell");
    outline.style.borderWidth = "0";

    var borderImage = document.getElementById("border-image");
    borderImage.style.borderWidth = "0";
}
onload = runRepaintTest;
</script>

<p>Tests that setting an outline or a border of 0 on an element without a border or outline doesn't repaint.</p>

<div id="border"></div>
<div id="outline"></div>
<div id="border-image"></div>

<table>
    <tr>
        <td id="cell"></td>
        <td></td>
    </tr>
</table>
